01 In short: what you need to know
- A landing page has one goal and one main action: leave a request, buy, book, call. Everything extra dilutes it.
- The first screen decides most of it. If it's unclear within 5 seconds on mobile what is offered and to whom, scrolling won't help.
- The structure is answers to the customer's questions in the order they arise: what is it → is it for me → why should I trust you → how much does it cost and what happens next → what if I'm not sure.
- Proof works only when it's specific and verifiable: figures, names, links, photos, not "an individual approach".
- Technical details eat conversion: a slow mobile form, extra fields, unclear errors, lost UTM tags.
- There's no "universal" conversion rate. It depends on the niche, price, traffic source and offer. Compare yourself with yourself before and after changes.
02 Landing page or multi-page site: which to choose
| Criterion | Landing page (single page) | Multi-page site |
|---|---|---|
| Goal | One action: request, purchase, booking | Informing, catalog, several directions |
| Traffic | Mostly paid (ads), email, social | Organic search + ads |
| Product | One service or product | Many services, products, sections |
| Launch speed | Days or a few weeks | Weeks or months |
| SEO potential | Limited: one URL for several queries | High: a page for each query |
| Hypothesis testing | Very convenient (one variable) | Harder |
Rule: a landing page is ideal when you sell one specific offer and send targeted traffic to it. If you need steady organic traffic on many queries, you need a site with service pages and a blog in addition to the landing page. A hybrid often works: a main site + separate landing pages for ad campaigns.
03 Before design: what to define
Most weak landing pages start from a layout instead of answers to these questions.
- Goal and main action. One. Request, call, booking, purchase.
- Audience and segments. Who comes, with what problem, at what stage of decision.
- The offer. What exactly the person gets, how fast, under what terms. Not "quality services" but a concrete result.
- Difference from competitors. One or two reasons to choose you that you can prove.
- Main objections. Too expensive? Unclear whether it will work? Afraid of being cheated? Too long? Too complicated?
- Proof. What you actually have: case studies, figures, testimonials, certificates, guarantees, a portfolio.
- Traffic source. What the person sees before clicking: an ad, a search query, an email. The landing page must continue that message.
The offer test. Show the headline to an acquaintance who doesn't know your business. If they can't say within 5 seconds what's offered and for whom, rewrite the offer.
04 Landing page structure: 12 blocks in the right order
The structure below covers the typical decision path. Not every block is mandatory, but keep the logic of the order.
| # | Block | Customer question it answers | What's in it |
|---|---|---|---|
| 1 | First screen (hero) | What is this and is it for me? | Offer headline, subheading, CTA, one visual focus |
| 2 | Quick proof | Can I trust you? | 1–2 figures, client logos, rating (real only) |
| 3 | Problem | Do they understand my situation? | Audience pains in the customer's language |
| 4 | Solution | How does it solve my problem? | What you offer and why it works |
| 5 | Benefits / what's included | What exactly will I get? | 3–6 points with a result, not epithets |
| 6 | How it works | What happens after I submit? | 3–5 steps with timelines |
| 7 | Case studies / results | Are there real examples? | Task → action → result with figures |
| 8 | Testimonials | What do others say? | Names, positions, photos, a link to the source |
| 9 | Price / terms | How much does it cost? | "From" price, packages, or what affects the price |
| 10 | Guarantees and risks | What if it doesn't work out? | Guarantee, timelines, contract, refund terms |
| 11 | FAQ | What about…? | 5–8 most common objections |
| 12 | Final CTA + form | What do I do next? | Reminder of the offer, a simple form, contacts |
Supporting elements: a sticky CTA on mobile, a callback button, messengers, a minimal footer with legal details.
05 The first screen: one job
The first screen has one job: explain the offer within a few seconds and propose the next step.
What it should contain:
- The brand (logo) for orientation.
- One headline with a clear offer: what, for whom, the result.
- One supporting phrase that adds specifics (timeframe, condition, feature).
- A CTA group: a main button and, if needed, a secondary one (for example, "See examples").
- One visual focus: the product, place, team or atmosphere, without competing with the text.
What it should not contain:
- Blocks of statistics, schedules, "chips" and badges over the photo.
- Auto-rotating carousels.
- Several equally weighted buttons with different actions.
- Autoplaying video with sound.
- Abstract headlines like "We create the future".
Headline formula:
[Result] for [whom] in [timeframe] / without [main pain]| Weak | Stronger |
|---|---|
| "Professional renovation services" | "Turnkey apartment renovation in Vinnytsia in 45 days with a fixed estimate" |
| "Innovative CRM for business" | "CRM for service crews: requests, visits and payments in one window" |
| "We'll help your business grow" | "A landing page for ads in 10 days: from brief to first leads" |
The mobile first screen is critical. If a user hasn't understood the offer within 5 seconds, scrolling won't save it. Check on a real phone: are the headline, subheading and button visible without scrolling?
06 Proof and objection handling
After the first screen, a person asks: "Why should I believe you?" Next come the customer's problems, the solution, case studies with figures, the work process, guarantees or timelines, FAQ and the final CTA.
Social proof: what works and what doesn't
Works (specific and verifiable):
- A testimonial with a name, position, company, photo and a link to the source (Google, Facebook, LinkedIn, video).
- A case study in the format "task → what we did → result" with figures: "Cut the response time to a request from 4 hours to 15 minutes".
- Client logos, if you can genuinely show them, with links to projects.
- Number of completed projects, years in business, a real rating with the platform named.
- Certificates, partnerships, awards with links.
Doesn't work:
- Anonymous reviews like "All great! Thanks! Ivan".
- Stock photos instead of real people.
- Round numbers without explanation ("100% of clients are satisfied").
- Invented case studies, ratings, logos. That's also a legal risk.
Case study template
Client: [name / industry]
Task: [what was wrong, what the goal was]
What we did: [2–3 key actions]
Result: [figures for a specific period]
Link: [to the project or testimonial]Objections and how to handle them
| Objection | How to handle it |
|---|---|
| "Too expensive" | Show what the price consists of, packages, installments, payback |
| "What if it doesn't work?" | Guarantees, staged payment, a pilot, a contract |
| "Too long" | A clear schedule with timelines and stages |
| "Too complicated" | A step-by-step process, "we take care of…" |
| "I don't know you" | Case studies, testimonials, a team with names, real photos |
| "Same as everyone" | Concrete differences backed by examples |
07 The lead form: how not to lose a person at the last moment
The form is where you lose the most people who are already interested.
Principles:
- Minimum fields. Name and phone (or messenger) are usually enough. Each extra field lowers conversion. Clarify the rest during the conversation.
- Clear button text. Not "Submit" but "Get a quote" or "Book a consultation".
- Autofill and correct field types. On mobile, the numeric keyboard should open for the phone field.
- Clear validation errors. "Enter the number in the format +380…" instead of "Error".
- Explain what happens next: "We'll call you back within 15 minutes during working hours".
- Confirmation after sending: a message on the page and, if possible, an email or messenger message.
- Consent to data processing without being intrusive, in line with the privacy policy.
- Spam protection without an annoying captcha: a honeypot field, server-side checks, invisible reCAPTCHA/Turnstile.
<form action="/lead" method="post" id="lead-form" novalidate>
<label for="name">Name</label>
<input id="name" name="name" type="text" autocomplete="name" required>
<label for="phone">Phone</label>
<input id="phone" name="phone" type="tel" inputmode="tel"
autocomplete="tel" placeholder="+380" required>
<!-- hidden fields for the source -->
<input type="hidden" name="utm_source">
<input type="hidden" name="utm_medium">
<input type="hidden" name="utm_campaign">
<input type="hidden" name="utm_content">
<input type="hidden" name="utm_term">
<input type="hidden" name="gclid">
<button type="submit">Get a quote</button>
<p class="note">We'll call you back within 15 minutes during working hours.</p>
</form>08 Mobile version: most of your traffic
For most advertising landing pages, mobile traffic dominates. The mobile version is not a "shrunken desktop" but a separate scenario.
- First screen: the headline, subheading and button are visible without scrolling.
- Buttons: large enough for a finger, with spacing between them.
- Sticky CTA at the bottom of the screen ("Call" / "Leave a request").
- Clickable phone (
tel:) and messenger buttons. - Font of at least 16 px for body text, sufficient contrast.
- Images responsive and light, with no horizontal scroll.
- Speed: LCP under 2.5 s on 4G. More in our Core Web Vitals guide.
09 Technical details that affect leads
It's often the small things that "eat" part of your leads: mobile form speed, autofill, minimum fields, clear validation errors, UTM in the CRM. Also: design without cards where they aren't needed for interaction. Less visual noise means more attention on the CTA.
1. UTM tags in the CRM
If a lead arrives without a source, you don't know which ad works. Save the tags on the first visit and insert them into the form:
const KEYS = ['utm_source','utm_medium','utm_campaign','utm_content','utm_term','gclid'];
const params = new URLSearchParams(location.search);
// save on first visit
KEYS.forEach(k => {
const v = params.get(k);
if (v) sessionStorage.setItem(k, v);
});
// insert into the form
document.querySelectorAll('#lead-form input[type="hidden"]').forEach(input => {
const v = sessionStorage.getItem(input.name);
if (v) input.value = v;
});2. A lead event in analytics
Set up a separate event for a successful form submission, not for a button click. For GA4 this can be generate_lead:
document.getElementById('lead-form').addEventListener('submit', () => {
// fire after a successful server response
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'generate_lead',
form_id: 'lead-form',
page: location.pathname
});
});Also track phone clicks, messenger clicks and scroll depth: this helps you see where people drop off.
3. Speed of getting a lead into work
A lead answered within 5–15 minutes converts into a deal far more often than one that waited a day. Set up an instant notification in Telegram or email and automatic card creation in the CRM. Then no lead gets lost.
4. Speed and stability
- Optimized images (AVIF/WebP),
widthandheight, hero withoutloading="lazy". - Chat, pixels and widgets deferred until interaction.
- No layout shifts while loading.
5. Legal and trust
- Privacy and cookie policies.
- Company or sole-proprietor details in the footer.
- HTTPS and a correctly configured cookie banner that doesn't cover the button.
10 Ad and landing page match
Conversion often drops not because of the landing page itself but because of a gap between the ad and the page.
- The same message. If the ad says "Bathroom renovation in 14 days", the first screen must say exactly that.
- Separate landing pages for segments. Different queries and audiences need different headlines and examples.
- One action. Don't send ad traffic to a home page with ten menu items.
- The same terms. Price, promotion and timelines in the ad and on the page must match.
- For search ads: insert the query wording into the headline instead of a generic phrase.
11 How to measure and improve conversion
What to count:
| Metric | What it shows |
|---|---|
| Conversion (leads / unique visitors) | Page effectiveness |
| Conversion by source and device | Where the problem is: in the channel or the mobile version |
| Cost per lead (CPL) | Ad economics |
| Lead quality (share of qualified) | Whether the volume is "inflated" |
| Lead → deal, revenue per lead | The real business result |
How to improve:
- Collect data for at least 2–4 weeks before drawing conclusions.
- Watch session recordings and heatmaps: where people stop, what they don't click, where they hit form errors.
- Formulate a hypothesis ("If we replace the headline with a concrete result, the share of clicks on the button will grow").
- Change one variable at a time: headline, first screen, form, testimonials, price.
- Sufficient sample. With low traffic an A/B test won't give a reliable conclusion, so it's better to make sequential improvements and compare periods.
- Evaluate by leads and deals, not just by clicks.
Conversion benchmarks depend heavily on niche, price and traffic source. Compare the result with your own baseline, not with the "market average".
12 Common landing page mistakes
- Several goals on one page. Sales, subscription, blog and catalog at once.
- An overloaded first screen: statistics, schedules, badges, a slider.
- A headline without an offer: "Welcome", "We are a team of professionals".
- A benefits list without results: "quality, reliability, experience".
- Fake or faceless proof.
- No price or reference point. The person goes to look for the answer at competitors.
- A long form with required fields that aren't needed at the first step.
- A poor mobile version and slow loading.
- Losing the lead source: no UTM, events or CRM integration.
- A gap between the ad and the page.
- No next step after the request: silence instead of confirmation and a quick call.
13 How long it takes and what drives cost
Timelines depend on material readiness, complexity and the number of revisions.
| Stage | What's included | Approximate time |
|---|---|---|
| Strategy and structure | Brief, analysis, offer, prototype | 2–5 days |
| Design | Desktop layout + mobile version | 3–7 days |
| Development | Markup, form, responsiveness, speed | 3–7 days |
| Integrations and analytics | CRM, UTM, events, notifications | 1–3 days |
| Testing and launch | Device, form and speed checks | 1–2 days |
Overall, a turnkey landing page usually takes from 1.5 to 4 weeks. Cost is affected by: whether you already have a brand style, the amount of copywriting, the number of integrations, animations and illustrations, multilingual support, and the platform (builder, WordPress, MODX, custom development).
Choose the platform for the task: a builder suits a quick hypothesis test, while for long-term work with speed, SEO and integrations, separate code or a CMS is better.
14 Pre-launch checklist
Offer and structure
- One goal and one main action
- The headline explains what, for whom and the result
- An uncluttered first screen: brand, headline, subheading, CTA, one visual focus
- The block order follows the customer's decision path
- Main objections handled (price, risk, timelines, trust)
Proof
- Testimonials with names and sources
- Case studies with figures and period
- All facts, logos and ratings are genuine
- There are guarantees or clear terms
Form and CTA
- Minimum fields, clear button text
- Correct field types and autofill
- Clear errors and a message after submission
- It's explained what happens next and when to expect a reply
Mobile and speed
- The mobile first screen shows the offer and button without scrolling
- Sticky CTA, clickable phone and messengers
- LCP under 2.5 s, INP under 200 ms, CLS under 0.1
- Images optimized, third-party scripts deferred
Analytics and CRM
- UTM and gclid are saved and reach the lead
- Events set up: form submission, call, messenger
- Leads instantly arrive in the CRM and notifications
- All forms tested on different devices
Legal
- Privacy and cookie policies
- Company details
- Consent to data processing presented correctly
15 FAQ
What is a landing page and how does it differ from a website?
A landing page is a single-page site with one goal: to prompt a specific action (request, purchase, booking). A multi-page site informs about the company, services and products and suits different queries and goals.
Which blocks are mandatory on a landing page that sells?
At minimum: a first screen with the offer, a description of the solution and benefits, proof (testimonials, case studies), the process or terms, answers to objections (FAQ) and a final call to action with a simple form. Add the rest as needed.
What conversion rate counts as good for a landing page?
There's no universal figure: it depends on niche, price, offer, traffic source and audience quality. It's more useful to track your own dynamics and cost per lead than to rely on others' averages.
How many fields should a form have?
The minimum necessary, usually name and phone or messenger. Each extra field lowers the likelihood of completion. If you need qualification, do it as a second step or during the conversation.
Does a landing page need a price?
Ideally at least a reference point ("from…") or an explanation of what the cost depends on. This filters out non-target inquiries and saves time, and it removes the most common objection.
How long does a turnkey landing page take?
Usually 1.5 to 4 weeks, depending on material readiness, complexity, the number of integrations and approvals. A simple test landing page on a builder can be launched faster.
Builder or custom development for a landing page?
For a quick hypothesis test and a small budget, a builder will do. When speed, SEO, CRM integrations, design flexibility and long-term work with traffic matter, WordPress, MODX or custom code is better.
How do I know a landing page isn't working?
Look at cost per lead, conversion by source and device, session recordings and heatmaps. Typical signals: a high bounce rate on mobile, few clicks on the main button, many started but unsent forms.
Is A/B testing necessary?
It's useful with enough traffic. With few visitors there won't be reliable conclusions, so first fix the obvious problems (offer, mobile version, form, speed) and compare periods.
How do I avoid losing leads?
Set up instant notifications, automatic card creation in the CRM, UTM saving, a fast-response routine and a confirmation for the customer after the form is sent.
16 Summary
A landing page that sells isn't about a pretty picture or "magic" blocks. It's a sequence of answers to the customer's questions, backed by proof and technically configured so that every lead reaches you with its source.
The order of action:
- Formulate the offer, goal and objections before opening Figma.
- Build the first screen: brand, headline, subheading, CTA, one visual focus.
- Lay out the blocks in decision logic: problem → solution → proof → process → price → guarantees → FAQ → CTA.
- Simplify the form and check the mobile version on a real phone.
- Set up UTM, events and CRM so you can see what works.
- Launch, measure and improve one hypothesis at a time.
Need a landing page that brings leads, not just a pretty one?
We'll build the structure around your offer and audience, make a fast mobile version and set up analytics and CRM so every lead comes with its source.